﻿<DemoPageSectionComponent Id="DataGrid-Selection-Single" ShowHorizontalScrollBar="true">
    @inject NwindDataService NwindDataService

    @if(Products == null) {
        <p><em>Loading...</em></p>
    } else {
        <DxDataGrid Data="@Products" @bind-SingleSelectedDataRow="@SelectedProduct" KeyFieldName="@nameof(Product.ProductId)">
            <DxDataGridColumn Field="@nameof(Product.ProductName)" />
            <DxDataGridComboBoxColumn Field="@nameof(Product.CategoryId)" Caption="Category"
                                      Data="@Categories" TextFieldName="@nameof(Category.CategoryName)" ValueFieldName="@nameof(Category.CategoryId)" />
            <DxDataGridSpinEditColumn Field="@nameof(Product.UnitPrice)" DisplayFormat="c" Width="120px" />
            <DxDataGridSpinEditColumn Field="@nameof(Product.UnitsInStock)" Width="120px" />
            <DxDataGridColumn Field="@nameof(Product.QuantityPerUnit)" />
            <DxDataGridCheckBoxColumn Field="@nameof(Product.Discontinued)" Width="120px" />
        </DxDataGrid>
        <p class="demo-text w-100 mt-2">Selected Product: <b>@(SelectedProduct == null ? "(none)" : SelectedProduct.ProductName)</b></p>
    }

    @code {
        IEnumerable<Product> Products { get; set; }
        IEnumerable<Category> Categories { get; set; }

        Product selectedProduct;
        public Product SelectedProduct {
            get {
                return selectedProduct;
            }
            set {
                selectedProduct = value;
                InvokeAsync(StateHasChanged);
            }
        }

        protected override async Task OnInitializedAsync() {
            Products = await NwindDataService.GetProductsAsync();
            Categories = await NwindDataService.GetCategoriesAsync();
            SelectedProduct = Products.FirstOrDefault();
        }
    }
</DemoPageSectionComponent>
